<!-- 警告提醒弹层 -->
<template>
    <div class="warning">
        <div class="warn-card">
            <p>{{warnText}}</p>
        </div>
    </div>
</template>

<script>
export default {
    name: "warning",
    props:[
        "warnShow",
        "warnText",
    ],
    data(){
        return{
           
        }
    },
    watch:{
        warnShow(newVal,oldVal){
            if(newVal){
                touchFalse()
                setTimeout(()=>{
                    this.$parent.warnShow=false
                },2000) 
            }else{
                touchTrue()
            }
        },
    },
    created(){ 
       
    },
    mounted(){
    },
    methods:{

    }
}
</script>
<style type="text/css" scoped>
.warning{
    width: 100%;
    height: 100%;
    position: fixed;
    left: 0;
    top: 0;
    z-index: 3000;
    box-sizing: border-box;
    padding: 0.14rem;
}
.warn-card{
    background: #ffb600 url('./../assets/img/icon/warn.png') no-repeat 0.36rem center;
    background-size: 0.4rem 0.4rem;
    width: 100%;
    box-sizing: border-box;
    height: 1.1rem;
    line-height: 1.1rem;
    color: #fff;
    font-size: 0.3rem;
    padding-left: 1.04rem;
    border-radius:0.2rem;
}
</style>